<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <title></title>
    <link rel="icon" href="favicon.ico" type="image/ico">
    <meta name="keywords" content="LightYear,,后台模板,后台管理系统,光年HTML模板">
    <meta name="description" content="LightYear是一个基于Bootstrap v3.3.7的后台管理系统的HTML模板。">
    <meta name="author" content="yinqi">
    <link href="/css/bootstrap.min.css" rel="stylesheet">
    <link href="/css/materialdesignicons.min.css" rel="stylesheet">
    <link href="/css/style.min.css" rel="stylesheet">
    <!--对话框-->
    <link rel="stylesheet" href="/js/jconfirm/jquery-confirm.min.css">
    <style>
        .input-with-icon {
            position: relative;
            padding-left: 20px;
            top: -5px;
            display: inline-block;
            vertical-align: middle;
            /* 确保这个div与其他行内元素垂直对齐 */
        }

        .input-with-icon input.btn-default {
            padding-left: 40px;
            /* 根据图标大小调整 */
        }

        .input-with-icon .icon {
            position: absolute;
            right: 5px;
            /* 根据需要调整 */
            top: 50%;
            transform: translateY(-50%);
            /* 垂直居中 */
            pointer-events: none;
            /* 防止点击图标时触发input的点击事件 */
        }
        /* 添加图标的链接样式 */

        .add-item {
            display: inline-block;
            margin-left: 10px;
            /* 与输入框保持间距 */
            text-decoration: none;
            /* 去除下划线 */
            color: #007bff;
            /* 假设链接颜色为蓝色 */
            /* 其他样式，如字体大小、鼠标悬停效果等 */
        }

        .add-item i {
            font-size: 1.5rem;
            /* 假设您想要图标稍大一些 */
            /* 其他图标样式 */
        }
        /* 根据需要添加其他样式 */

        td{
            vertical-align:middle;
        }
    </style>
</head>

<body>
<script src="/js/jquery.min.js" type="text/javascript"></script>
<div class="lyear-layout-web">
    <div class="lyear-layout-container">

        <!--导入头部信息-->
        <div id="header"></div>
        <script>$("#header").load("/header.html")</script>
        <!--导入左侧菜单栏-->
        <!--左侧导航-->
        <aside class="lyear-layout-sidebar">
            <!-- logo -->
            <div id="logo" class="sidebar-header">
                <a href="main.html"><img src="/images/logo-sidebar.png" title="LightYear" alt="LightYear"/></a>
            </div>
            <div class="lyear-layout-sidebar-scroll">
                <!--导入菜单栏-->
                <!--引入left-menu.html页面中的 th:fragment="leftMenu" 部分代码-->
                <div th:replace="/system/common/left :: leftMenu"></div>
                <div class="sidebar-footer">
                    <p class="copyright">Copyright &copy; 2019. <a target="_blank"
                                                                   href="http://lyear.itshubao.com">IT书包</a>
                        All rights reserved.</p>
                </div>
            </div>
        </aside>
        <!--页面主要内容-->
        <main class="lyear-layout-content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="card">
                            <div class="card-toolbar clearfix">
                                <a class="btn btn-primary m-r-5" href="/system/company/deptAdd"><i class="mdi mdi-account-plus"></i>添加</a>
                                <a class="btn btn-primary m-r-5" href="javascript:;" onclick="edit('/system/company/dept/edit')" ><i class="mdi mdi-account-edit"></i>编辑</a>
                                <a class="btn btn-primary m-r-5" href="javascript:;" onclick="del('/system/company/dept/delete')" ><i class="mdi mdi-account-remove"></i>删除</a>

                            </div>
                            <div class="card-body">
                                <div class="table-responsive">
                                    <table class="table table-bordered">
                                        <thead>
                                        <tr>
                                            <th>
                                                <label class="lyear-checkbox checkbox-primary">
                                                    <input type="checkbox" id="check-all"><span></span>
                                                </label>
                                            </th>
                                            <th>职位名称</th>
                                            <th>状态</th>
                                            <th>创建者</th>
                                            <th>创建时间</th>
                                            <th>更新者</th>
                                            <th>更新时间</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <!--遍历一级菜单-->
                                        <div th:if="${!#lists.isEmpty(deptList)}" th:each="deptList:${deptList}">
                                            <tr>
                                                <td style="vertical-align:middle;">
                                                    <label class="lyear-checkbox checkbox-primary">
                                                        <input type="checkbox" name="ids[]" th:value="${deptList.deptId}"><span></span>
                                                    </label>
                                                </td>
                                                <td style="vertical-align:middle;"><b>[[${deptList.name}]]</b></td>
                                                <td style="vertical-align:middle;">[[${deptList.status}]]</td>
                                                <td align="center">[[${deptList.creator}]]</td>
                                                <td align="center" style="vertical-align:middle;">[[${deptList.createTime}]]</td>
                                                <td style="vertical-align:middle;"><font class="text-success">[[${deptList.modifier}]]</font></td>
                                                <td align="center" style="vertical-align:middle;">[[${deptList.updateTime}]]</td>
                                            </tr>

                                            <div th:if="${!#lists.isEmpty(postList)}" th:each="postList:${postList}">
                                                <div th:if="${postList.postId == deptList.deptId}">
                                                    <tr>
                                                        <!--遍历二级菜单-->
                                                        <td style="vertical-align:middle;">
                                                            <label class="lyear-checkbox checkbox-primary">
                                                                <input type="checkbox" name="ids[]" th:value="${postList.deptId}"><span></span>
                                                            </label>
                                                        </td>
                                                        <td style="vertical-align:middle;"><b>!-----[[${postList.name}]]</b></td>
                                                        <td style="vertical-align:middle;">[[${postList.status}]]</td>
                                                        <td align="center">[[${postList.creator}]]</td>
                                                        <td align="center" style="vertical-align:middle;">[[${postList.createTime}]]</td>
                                                        <td style="vertical-align:middle;"><font class="text-success">[[${postList.modifier}]]</font></td>
                                                        <td align="center" style="vertical-align:middle;">[[${postList.updateTime}]]</td>
                                                    </tr>

                                                </div>
                                            </div>
                                        </div>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>

            </div>
        </main>
        <!--End 页面主要内容-->
    </div>
</div>
<div id="footer"></div>
<script>$("#footer").load("/footer.html")</script>

<script type="text/javascript" src="/js/perfect-scrollbar.min.js"></script>
<script type="text/javascript" src="/js/main.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){

    });

    //解析url调用不同的方法
    function operation(obj){
        let url = $(obj).attr("name");
        //判断如果url中包含edit,调用编辑的方法
        if (url.indexOf("edit(")!==-1){
            url  = url.substring(6,url.length-2);
            edit(url);
            //判断如果url中包含del,调用删除的方法
        }else if(url.indexOf("del(")!==-1){
            url  = url.substring(5,url.length-2);
            del(url);
        }
        else if(url.indexOf("add(")!==-1){
            url  = url.substring(5,url.length-2);
            add(url);
        }
    }
    function del(url){
        if($("input[type='checkbox']:checked").length !== 1){
            showWarningMsg('请选择一条数据进行删除！');
            return;
        }
        var id = $("input[type='checkbox']:checked").val();
        $.confirm({
            title: '确定删除？',
            content: '删除后数据不可恢复，请慎重！',
            buttons: {
                confirm: {
                    text: '确认',
                    action: function(){
                        deleteReq(id,url);
                    }
                },
                cancel: {
                    text: '关闭',
                    action: function(){

                    }
                }
            }
        });
    }


    //打开编辑页面
    function edit(url){
        if($("input[type='checkbox']:checked").length !== 1){
            showWarningMsg('请选择一条数据进行编辑！');
            return;
        }
        window.location.href = url + '/' + $("input[type='checkbox']:checked").val();
    }
    //打开添加页面
    function add(url){
        window.location.href = url;
    }
    //调用删除方法
    function deleteReq(id,url){
        $.ajax({
            url:url,
            type:'DELETE',
            data:{id:id},
            success:function(data){
                if(data === "success"){
                    showSuccessMsg('菜单删除成功!',function(){
                        $("input[type='checkbox']:checked").parents("tr").remove();
                    })
                }else{
                    showErrorMsg(data);
                }
            },
            error:function(data){
                alert('网络错误!');
            }
        });
    }
</script>
</body>
</html>